@extends('admin.layout.app')
@section('title', '项目列表')

@section('nav')
    @include('admin.layout.nav', ['title'=> ['项目验收管理','项目列表']])
@endsection

@section('content')
    <div class="box box-primary" style="min-height: 300px;">
        <div class="box-header with-border">
            <h3 class="box-title">项目列表</h3>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <form class="form-inline" style="margin-bottom: 15px;" autocomplete="off">
                <div class="form-group">
                    <label for="name">项目名称</label>
                    <input type="text" class="form-control" value="{{isset($query['name'])?$query['name']:''}}" name="name" placeholder="请输入">
                </div>
                <button type="submit" class="btn btn-default">查询</button>
            </form>
            <div class="table-responsive">
                <table class="table table-bordered table-hover">
                    <thead>
                    <tr class="active">
                        <th width="50px">序号</th>
                        <th width="100px">项目名称</th>
                        <th width="100px">申请理由</th>
                        <th width="100px">项目申请人</th>
                        <th width="100px">项目甲方</th>
                        <th width="100px">项目金额</th>
                        <th width="80px">审核状态</th>
                        <th width="150px">审核时间</th>
                        <th width="80px">执行状态</th>
                        <th width="150px">完成日期</th>
                        <th width="80px">是否通过验收</th>
                        <th style="width: 80px">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($list as $item)
                        <tr>
                            <td>{{$loop->index+1+($list->currentPage()-1)*$list->perPage()}}</td>
                            <td>{{$item->name}}</td>
                            <td>{{$item->reason}}</td>
                            <td>{{$item->user_name}}</td>
                            <td>{{$item->first_party}}</td>
                            <td>{{$item->money}}</td>
                            <td><span class="badge bg-{{$item->status==0?'yellow':($item->status==1?'green':'red')}}">{{$item->status==0?'待审核':($item->status==1?'通过':'未通过')}}</span></td>
                            <td>{{$item->check_time}}</td>
                            <td><span class="badge bg-{{$item->execute_status==0?'yellow':($item->execute_status==1?'blue':'green')}}">{{$item->execute_status==0?'待开工':($item->execute_status==1?'执行中':'已完成')}}</span></td>
                            <td>{{$item->execute_time}}</td>
                            <td>
                                <span class="badge bg-{{$item->accept_status==0?'yellow':($item->accept_status==1?'green':'red')}}">{{$item->accept_status==0?'待验收':($item->accept_status==1?'通过':'未通过')}}</span>
                            </td>
                            <td>
                                @if($item->accept_status == 0)
                                    <button class="btn btn-primary btn-sm handleAccept" data-name="{{$item->name}}" data-id="{{$item->id}}" data-toggle="modal" data-target="#myModal">验收</button>
                                @else
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="8" align="center">暂无数据</td>
                        </tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        <!-- /.box-body -->
        <div class="box-footer clearfix">
            <div class="pull-right">
                {{ $list->links() }}
            </div>
        </div>

        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">验收</h4>
                    </div>

                    <form class="form-horizontal">
                        <input name="pid" value="0" style="display: none;" />
                        <div class="modal-body">
                            <div class="form-group">
                                <label for="projectname" class="col-sm-2 control-label">项目名称:</label>
                                <div class="col-sm-10">
                                    <div id="projectname" style="position: relative;top:8px;"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="status" class="col-sm-2 control-label">是否通过:</label>
                                <div class="radio col-sm-10">
                                    <label>
                                        <input type="radio" id="status1" name="status" value="1" checked>是
                                    </label>
                                    <label>
                                        <input type="radio" id="status2"  name="status" value="2">否
                                    </label>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="remark" class="col-sm-2 control-label">验收意见:</label>
                                <div class="col-sm-10">
                                    <textarea maxlength="255" name="remark" class="form-control" placeholder="请输入"></textarea>
                                </div>
                            </div>
                        </div>
                        <!-- /.box-body -->
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="button" class="btn btn-primary submitAccept">保存</button>
                        </div>
                        <!-- /.box-footer -->
                    </form>

                </div>
            </div>
        </div>
    </div>
@endsection

@section('style')
    <style>

    </style>
@endsection

@section('js')
    <script type="text/javascript" src="/lib/layer/2.4/layer.js"></script>
    <script>
        $(function() {
            $('.handleAccept').click(function() {
                $('textarea[name=remark]').val('');//清空
                var pid = $(this).attr('data-id');
                $('input[name=pid]').val(pid);

                var projectname = $(this).attr('data-name');
                $('#projectname').text(projectname);
            });

            $('.submitAccept').click(function(){
                var pid_ = $('input[name=pid]').val();
                var status_ = $('input[name=status]:checked').val();
                var remark_ = $('textarea[name=remark]').val();
                if(remark_ == ''){
                    layer.msg('请输入验收意见', {icon: 5});
                    return false;
                }
                var load_index = layer.msg('正在处理中', {
                    icon: 16,
                    shade: 0.5,
                    time: 15000
                });
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': "{{ csrf_token() }}"
                    }
                });
                $.post('/project/accept', {pid: pid_, status: status_, remark: remark_}, function (res) {
                    if(res.code == 200){
                        layer.close(load_index);
                        layer.msg('操作成功！', {icon: 1});
                        window.location.reload();
                    }else{
                        layer.msg(res.message, {icon: 5});
                    }
                });
            });
        })
    </script>
@endsection